import {Component, ElementRef, ViewChild} from '@angular/core';
import {IonicPage, NavController, NavParams, PopoverController} from 'ionic-angular';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/interval';
import {DataQueryServiceProvider} from "@providers/data-query-service/data-query-service";
import {DialogProvider} from "@providers/dialog";
import QRCode from 'qrcode'

/**
 * Generated class for the WxPayQrcodePage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
    templateUrl: 'wxPay_qrcode.html',
})
export class WxPayQrcodePage {
    @ViewChild('qrcode') qrcode: ElementRef;
    orderId: string;
    wxUrl: any;
    _data = this.navParams.data;
    private _subscription: any;

    constructor(public navCtrl: NavController, public navParams: NavParams,
                private dataQueryService: DataQueryServiceProvider,
                private dialog: DialogProvider,
                private popoverCtrl: PopoverController) {
        console.info(this._data['orderId']);
    }

    ionViewDidLoad() {
        this.dialog.showLoading();
        console.info(this._data['orderId']);
        // let _url;
        this.dataQueryService.getWXPayQrcode({
            'PAYTYPE': 'PiWeChatAccount',
            'PARTYID': '00000101',
            'total_fee': this._data['sum'],
            'out_trade_no': this._data['orderId']
        }).subscribe(value => {
            /*.map(value => value['flag'] == '1' ? value['code_url'] : '').toPromise().then(value => {*/
            this.wxUrl = value['code_url'];
            console.info(this.wxUrl);
            this.orderId = this._data['orderId'];
            let qrcode_c = document.getElementById("qrcode_c");//获取生成二维码的节点
            //  console.info(this.wxUrl);//生成二维码所需数据
            let qrcode = new QRCode(qrcode_c, { //设置二维码显示的大小等信息
                width: 200,
                height: 200
            });
            //setTimeout(()=>{
            qrcode.makeCode(this.wxUrl);//生成二维码
            //  },1000);
        }, error => {
        });
        /* clearInterval(producerTimer);
         clearInterval(consumerTimer);*/
        /*let data = {
          text: _url,
          correctLevel: QRCode.CorrectLevel.H
        };
        console.info(data);
        new QRCode(this.qrcode.nativeElement, data);*/

        this._subscription = Observable.interval(1000 * 5).subscribe(
            () => {
                console.info("ss");
                this.dataQueryService.isQrPaySucc({
                    "PAYTYPE": "PiWeChatAccount",
                    "PARTYID": "00000101",
                    "out_trade_no": this._data['orderId']
                })
                    .subscribe(value => {
                        let state = value;
                        console.info(state);
                        if (state != "NOTPAY") {
                            this._subscription.unsubscribe();
                            let popover = this.popoverCtrl.create('RpayImagePage', this._data, {cssClass: 'jl_mask'});
                            popover.present();
                            setTimeout(() => {
                                this.navCtrl.popToRoot(this._data);
                            }, 3000);
                            //this.navCtrl.popToRoot();
                            //this.viewController.dismiss();
                            console.info("sj");

                        }

                    }, error => {
                    });
            });
        this.dialog.hideLoading();
    }

    ionViewWillUnload() {
        this._subscription && this._subscription.unsubscribe()
        // clearInterval(producerTimer);
        //clearInterval(consumerTimer);
    }
}
